<script setup lang='ts'>
// 自定义 规则
//interface Props {
//}

import { defineEmits, ref, computed, defineExpose, onMounted } from 'vue';
import { authAdmin, authManage } from '@/public'
import SelectTeam from './selectTeam.vue'
const { title } = defineProps({
    title: {
        type: String,
    },

});
// 头部吸顶位置
const statusBarHeight = computed(() => { return uni.getSystemInfoSync().statusBarHeight })
/**
 * @property 变量
 */
// 经理
const manage = ref<string>('');
// 团队
const team = ref<string>('');
// 选择团队
const isSelectTeam = ref<boolean>(false);
// 选择
const teamRef = ref();
// 
const emits = defineEmits(['confim'])
/**
 * @property  所有请求以api开头 如:apiDataInfo
 */
// const apiManageList = async () => {
//     const res = await teamStore.apiManagerList();
//     console.log(res)
// }
/**
 * @property 自定义事件 以事件名开头 如: clickButton,inputDev
 */

const clickTeam = () => {
    isSelectTeam.value = (authAdmin() || authManage());
    teamRef.value.apiManageList();
}

// 切换 选择的团队
const clickConfirm = (value: { team: string, manage: string }) => {
    manage.value = value.manage
    team.value = value.team
    emits('confim')

}
// 
const setIsSelectTeam = () => {
    clickTeam();
}
/**
 * @property 内置方法
 */
onMounted(() => {
    setIsSelectTeam();
})
defineExpose({
    setIsSelectTeam
})

</script>
<template>
    <div class="fixed top-0 w-[100%]">
        <div :style="{
            height: statusBarHeight + 'px'
        }" class="bg-[#fff]">
        </div>
        <div class="w-[100%] h-[44px] bg-[#fff] fra pl-3 flex relative">
            <div class="flex min-w-100" v-if="authAdmin() || authManage()" @click="clickTeam">
                <text class="font-size-32" v-if="!team">领导您好！请选择团队查看</text>
                <text class="font-size-32" v-if="manage">{{ manage }}/</text>
                <text class="font-size-32 mr-2" v-if="team">{{ team }}</text>
                <up-icon name="arrow-down"></up-icon>
            </div>
            <div class="absolute left-[50%] top-[50%] font-size-24" style="transform: translate(-50%,-50%);"
                v-if="title">
                {{ title }}
            </div>
        </div>
    </div>
    <SelectTeam :is-show="isSelectTeam" ref="teamRef" @confirm="clickConfirm" @close="isSelectTeam = false" />

</template>
<style lang="scss" scoped></style>